<script>
  import { createEventDispatcher } from "svelte";
  const dispatch = createEventDispatcher();
  let value = "";

  function handleSubmit() {
    if (value) {
      dispatch("todoFormSubmit", value);
      value = "";
    }
  }
</script>

<form on:submit|preventDefault={handleSubmit}>
  <input
    class="p-3 border bg-gray-200 text-gray-800 border-gray-300 outline-none
    w-full text-xl placeholder-gray-600 rounded dark:bg-gray-800
    dark:text-gray-400 dark:border-gray-800"
    type="text"
    placeholder="准备做什么?"
    bind:value />
</form>
